<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>layui</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="__PUBLIC__/layui/css/layui.css"  media="all">
    <link rel="stylesheet" href="__PUBLIC__/font-awesome/css/font-awesome.min.css" media="all" />
    <link rel="stylesheet" href="__CSS__/admin.css"  media="all">
    <script src="{$Think.config.httpFlag}{$Think.config.google_map_url}" async="async"></script>
    <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
    <style>
        .layui-tab-content{
            position: relative;
            overflow-y:auto ;
            overflow-x: hidden;
        }
        .layui-form-item .layui-input-inline{
            width: 500px;
        }
        .unifydelbut{
            border: 1px solid red;
            text-align: center;
            width: 50px;
            height: 30px;
            line-height: 30px;
            border-radius: 5px;
            color: #fff;
            background: red;
        }
        #addclassify {
            display: inline-block;
            width: 40px;
            height: 40px;
            border: 1px solid #666;
            line-height: 40px;
            border-radius: 40px;
            text-align: center;
            cursor: pointer;
        }
        .sale_price,.cost_price{
            width:82%;
            float:left;
        }
        .currency{
            width:8%;
            margin-top:10px;
            margin-right:5px;
            font-size:12px;
            font-weight:bold;
            float:left;
        }
        .color-input{
            background-color: #a9a9a95c;
        }
    </style>
    <script>
        //获取提示
        function showDefaultTips(id) {
            layer.tips("默认值用于产品售卖时获取的门票价格，目前仅支持一个默认值", "#"+id+"", {
                tips: [1, "#1E9FFF"]
            });
        }
    </script>
</head>
<body>
<div class="layui-tab layui-tab-card" style="box-shadow: none">
    <ul class="layui-tab-title">
        <li class="layui-this">门票</li>
    </ul>
    <div class="layui-tab-content">
        <div class="layui-tab-item layui-show">
            <form class="layui-form" id="form">
                {notempty name="$menu"}
                <input type="hidden" id="poiid" name="id" value="{$menu.id}">
                {/notempty}

                <!--门票信息-->
                <div class="layui-form-item">
                    <label class="layui-form-label">门票信息</label>
                    <div class="layui-input-inline">
                        <textarea id="ticket" placeholder="请输入内容" class="layui-textarea" name="ticket">{notempty name='$menu'}{$menu.ticket}{/notempty}</textarea>
                    </div>
                </div>
                <!--门票成本-->
                <div class="layui-form-item">
                    <label class="layui-form-label">门票成本</label>
                    <div class="layui-input-inline">
                        <textarea id="ticket_cost" placeholder="请输入内容" class="layui-textarea" name="ticket_cost">{notempty name='$menu'}{$menu.ticket_cost}{/notempty}</textarea>
                    </div>
                </div>

                <!--采购渠道-->
                <div class="layui-form-item">
                    <label class="layui-form-label">采购渠道</label>
                    <div class="layui-input-inline" style="width:150px;font-size:12px;">
                        <select id="buyType" lay-filter="buyType" lay-search="">
                            <option value="supplier" {if !empty($menu['supplier_id'])} selected{/if}>供应商</option>
                            <option value="driver" {if !empty($menu['driver_id'])} selected{/if}>司导</option>
                        </select>
                    </div>
                    <div class="layui-input-inline driver_div" {if !empty($menu['driver_id'])} selected{/if} style="width:500px;margin-left:5px;font-size:12px;{if empty($menu.driver_id)}display:none;{/if}">
                        <input type="hidden" id="driver_str" name="driver_str" value="{notempty name="$menu.driver_str"}{$menu.driver_str}{/notempty}">
                        <select name="driver_id" id="driver_id" lay-filter="driver_id" lay-search="">
                            {if !empty($menu['driver_id'])}
                            <option value="{trip.driver_id}">{$menu.driver_str}</option>
                            {else}
                            <option value="" disabled selected hidden>请输入司导姓名后回车查询</option>
                            {/if}
                        </select>
                    </div>
                    <div class="layui-input-inline supplier_div" style="width:300px;margin-left:5px;font-size:12px;{if !empty($menu.driver_id)}display:none;{/if}">
                        <select name="supplier_id" id="supplier_id" lay-search="">
                            <option value="" >供应商</option>
                            <option value="999999" {if  isset($menu['supplier_id']) AND "999999"==$menu['supplier_id']} selected{/if}>自营</option>
                            {volist name='supplier' id='vo'}
                            <option value="{$vo.id}" {if  isset($menu['supplier_id']) AND $vo.id==$menu['supplier_id']} selected{/if}>{$vo.name}</option>
                            {/volist}
                            <option value="1000000" {if  isset($menu['supplier_id']) AND "1000000"==$menu['supplier_id']} selected{/if}>其他</option>
                        </select>
                    </div>
                    <div class="layui-input-inline supplier_div" style="font-size:12px;margin-top:8px;margin-left:10px;{if !empty($menu.driver_id)}display:none;{/if}">
                        <a href="javascript:void(0);" style="text-decoration:underline;color:blue;" id="toSupplier">查看供应商</a>
                    </div>
                </div>

                <!--采购方式-->
                <div class="layui-form-item">
                    <label class="layui-form-label"></label>
                    <div class="layui-input-inline">
                        <textarea id="ticket_process" placeholder="请输入采购方式" class="layui-textarea" name="ticket_process">{notempty name='$menu'}{$menu.ticket_process}{/notempty}</textarea>
                    </div>
                </div>

                <!--订票网址-->
                <div class="layui-form-item">
                    <label class="layui-form-label">官网地址</label>
                    <div class="layui-input-inline">
                        <input id="ticket_url" name="ticket_url" maxlength="100" value="{notempty name='$menu'}{$menu.ticket_url}{/notempty}" placeholder="请输入" autocomplete="off" class="layui-input" type="text">
                    </div>
                </div>

                <!--票价配置-->
                <div class="layui-form-item">
                    <label class="layui-form-label">票价配置</label>
                    <div class="layui-input-inline" style="width:85%;">
                        <button type="button" class="layui-btn" data-value="0" id="modify">编辑</button>
                        <input type="hidden" id="currencyCode" value="{$currencyCode}">
                        <table class="layui-table" lay-even="" lay-skin="row" lay-size="sm">
                            <colgroup>
                                <col width="7%">
                                <col width="15%">
                                <col width="20%">
                                <col width="7%">
                                <col width="15%">
                                <col width="15%">
                                <col width="8%">
                                <col width="8%">
                            </colgroup>
                            <thead>
                            <tr>
                                <th><i id="defaultTips" onmouseover="showDefaultTips('defaultTips')"  class="layui-icon" style="margin-right: 4px;">&#xe702;</i>默认</th>
                                <th colspan="2">门票名称</th>
                                <th>数量</th>
                                <th>建议销售价（{$currencyName}）</th>
                                <th>采购成本价（{$currencyName}）</th>
                                <th>收费方式</th>
                                <th>操作</th>
                            </tr>
                            </thead>
                            <tbody id="ticket_body">
                            {if !empty($ticketPriceData)}
                            {volist name="$ticketPriceData" id="vo"}
                            <tr class="ticket_tr">
                                <td><input disabled autocomplete="off" name="default" class="layui-input tic-input color-input tic-default" type="radio" {notempty name="$vo.default"}checked{/notempty}></td>
                                <td><input disabled value="{$menu.name}({$menu.eng_name})" autocomplete="off" class="layui-input tic-input color-input" type="text" readonly></td>
                                <td><input disabled value="{$vo.name}" autocomplete="off" placeholder="请输入门票套餐名称" class="layui-input tic-input color-input ticket_name" type="text"></td>
                                <td><input disabled value="x 1" autocomplete="off" class="layui-input tic-input color-input" type="text" readonly></td>
                                <td>
                                    <div class="currency">{$currency}</div>
                                    <input disabled value="{$vo.sale_price}" autocomplete="off" class="layui-input tic-input color-input sale_price" placeholder="请输入销售价" type="text">
                                </td>
                                <td>
                                    <div class="currency">{$currency}</div>
                                    <input disabled value="{$vo.cost_price}" autocomplete="off" class="layui-input tic-input color-input cost_price" placeholder="请输入采购价" type="text">
                                </td>
                                <td>
                                    <input type="checkbox" name="charge_type" value="2" id="{$vo.charge_type}" lay-filter="charge_type" lay-skin="switch" <?php if($vo['charge_type']==2){ echo 'checked';} ?> lay-text="车|人">
                                </td>
                                <td>
                                    <input disabled value="删除" autocomplete="off" class="layui-input color-input deleteSpace" type="text" readonly>
                                    <button type="button" class="unifydelbut deleteTicket" style="display:none;">删除</button>
                                </td>
                            </tr>
                            {/volist}
                            {/if}
                            </tbody>
                        </table>
                        <div style="text-align: center;margin-bottom:10px;">
                            <span id="addclassify" style="display:none;">
                                <i class="layui-icon" style="font-size: 30px"></i>
                            </span>
                        </div>
                    </div>
                </div>

                <!--门票最后一次修改时间-->
                <div class="layui-form-item">
                    <label class="layui-form-label">上次修改于</label>
                    <div class="layui-input-inline">
                        <input maxlength="50"  class="layui-input" value="{notempty name='$menu'}{$menu.ticket_last_updtime}{/notempty}"  type="text" readonly>
                    </div>
                </div>
                <!--门票最后一次修改时间-->
                <div class="layui-form-item">
                    <label class="layui-form-label">上次修改人</label>
                    <div class="layui-input-inline">
                        <input maxlength="50"  class="layui-input" value="{notempty name='$menu'}{$menu.ticket_last_admin}{/notempty}" type="text" readonly>
                    </div>
                </div>

                <!--提交-->
                <div class="layui-form-item" style="margin-top:50px;">
                    <div class="layui-input-block">
                        <button class="layui-btn" lay-submit lay-filter="form">立即提交</button>
                        <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>

<script src="__PUBLIC__/layui/layui.js"></script>
<script src="__PUBLIC__/jquery/jquery.min.js"></script>
<script>
    layui.use(['layer','form'], function() {
        var layer = layui.layer,
            $ = layui.jquery,
            form = layui.form;
        $(window).on('load', function() {
            form.on('submit(form)', function() {
                var ticketData = '';
                var error = false;
                $(".ticket_tr").each(function(){
                    var ticket_default = $(this).find("input[name=default]:checked").val();
                    var ticket_charge_type = $(this).find("input[name=charge_type]:checked").val();
                    var ticket_name = $(this).find(".ticket_name").val();
                    var sale_price = $(this).find(".sale_price").val();
                    var cost_price = $(this).find(".cost_price").val();
                    if(ticket_name==''){
                        error = true;
                        return false;
                    }
                    if(ticket_default=='on'){
                        ticket_default = 1;
                    }else{
                        ticket_default = 0;
                    }
                    //默认是按人头收
                    ticket_charge_type = ticket_charge_type || 1;

                    var ticket_data = ticket_name+"_"+sale_price+"_"+cost_price+"_"+ticket_default+"_"+ticket_charge_type;
                    ticketData += ","+ticket_data;
                });
                ticketData = ticketData.substring(1,ticketData.length);
                console.log(ticketData);
                if(error){
                    layer.msg("请补全票价名称");
                    return false;
                }

                var buyType = $("#buyType").val();
                var supplier_id = '';
                var driver_id = '';
                var driver_str = '';
                if(buyType=='driver'){
                    driver_id = $("#driver_id").val();
                    driver_str = $("#driver_str").val();
                }else{
                    supplier_id = $("#supplier_id").val();
                }

                var id = $("#poiid").val();
                var currencyCode = $("#currencyCode").val();
                var ticket = $("#ticket").val();
                var ticket_cost = $("#ticket_cost").val();
                var ticket_url = $("#ticket_url").val();
                var ticket_process = $("#ticket_process").val();

                $.ajax({
                    url:"{:url('admin/poi/addticket')}",
                    data:{
                        'id':id,
                        'ticket':ticket,
                        'ticket_cost':ticket_cost,
                        'ticket_url':ticket_url,
                        'currencyCode':currencyCode,
                        'ticketData':ticketData,
                        'supplier_id':supplier_id,
                        'driver_id':driver_id,
                        'driver_str':driver_str,
                        'ticket_process':ticket_process
                    },
                    type:'post',
                    async: false,
                    success:function(res) {
                        layer.msg(res.msg);
                        if(res.code == 1) {
                            setTimeout(function(){
                                var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                                parent.layer.close(index); //再执行关闭
                            },1500);
                        }
                    }
                });
                return false;
            });

            //增加票价
            $("#addclassify").click(function(){
                var is_default = "";
                if($("#ticket_body tr").length<1){
                    is_default = "checked";
                }
                var html = '<tr class="ticket_tr">' +
                    '<td><input autocomplete="off" name="default" class="layui-input tic-input tic-default" type="radio" '+is_default+'></td>' +
                    '<td><input value="{$menu.name}({$menu.eng_name})" autocomplete="off" class="layui-input tic-input" type="text" readonly></td>' +
                    '<td><input autocomplete="off" placeholder="请输入门票名称" class="layui-input tic-input ticket_name" type="text"></td>' +
                    '<td><input value="x 1" autocomplete="off" class="layui-input tic-input" type="text" readonly></td>' +
                    '<td>' +
                    '<div class="currency">{$currency}</div>' +
                    '<input autocomplete="off" class="layui-input tic-input sale_price" placeholder="请输入销售价" type="text">' +
                    '</td>' +
                    '<td>' +
                    '<div class="currency">{$currency}</div>' +
                    '<input autocomplete="off" class="layui-input tic-input cost_price" placeholder="请输入采购价" type="text">' +
                    '</td>' +
                    '<td>' +
                    '<input type="checkbox" name="charge_type" value="2" lay-filter="charge_type" lay-skin="switch" lay-text="车|人">' +
                    '</td>' +
                    '<td>' +
                    '<input disabled value="删除" autocomplete="off" class="layui-input color-input deleteSpace" type="text" readonly style="display:none;">' +
                    '<button type="button" class="unifydelbut tic-input deleteTicket">删除</button>' +
                    '</td>' +
                    '</tr>';
                $("#ticket_body").append(html);
                form.render('radio');
                form.render('checkbox');
                return false;
            });

            //删除票价
            $(document).on("click",".deleteTicket",function(){
                var that = $(this);
                layer.confirm('确定删除?', function(index) {
                    that.parent().parent().remove();
                    layer.close(index);
                });
                return false;
            });

            //点击进入编辑
            $(document).on("click","#modify",function(){
                var datavalue = $(this).attr("data-value");
                if(datavalue==1){
                    $("#addclassify").hide();
                    $(".deleteSpace").show();
                    $(".deleteTicket").hide();
                    $(".tic-input").addClass("color-input");
                    $(".tic-input").attr("disabled","disabled");
                    $(this).attr("data-value",0);
                    $(this).removeClass("layui-btn-warm");
                    form.render('radio')
                }else{
                    $("#addclassify").show();
                    $(".deleteSpace").hide();
                    $(".deleteTicket").show();
                    $(".tic-input").removeClass("color-input");
                    $(".tic-input").removeAttr("disabled");
                    $(this).attr("data-value",1);
                    $(this).addClass("layui-btn-warm");
                    form.render('radio')
                }

                return false;
            });
            $(document).on('click','.tic-default',function(){
                $(".tic-default").removeAttr("checked");
                $(this).attr('checked');
            })
            //选择采购渠道
            form.on('select(buyType)', function(param){
                var type = param.value;
                if(type=='driver'){
                    $(".supplier_div").hide();
                    $(".driver_div").show();
                    $("#supplier_id").val('');
                }else{
                    $(".supplier_div").show();
                    $(".driver_div").hide();
                    $("#driver_id").val('');
                    $("#driver_id").html('<option value="" disabled selected hidden>请输入司导姓名后回车查询</option>');
                    $("#driver_str").val('');
                    $(".driver_div").find("input").val('');
                }
                form.render('select');
                bindDriverFunc();
                return false;
            });
            form.on('select(driver_id)', function(param){
                var text = param.elem[param.elem.selectedIndex].text;
                $("#driver_str").attr("value",text);
                return false;
            });
            //查询司导
            function bindDriverFunc(){
                $(".driver_div input").on('keyup',driverFind);
            }
            function driverFind(e) {
                if (e.keyCode == 13) {
                    var driver_name = $(this).val();
                    $.ajax({
                        url:"{:url('admin/product/getDriverData')}",
                        data:{name:driver_name},
                        type:'post',
                        success:function(data) {
                            if(data.length<1){
                                return false;
                            }
                            var html="<option value=''>请选择司导</option>";
                            for(var i=0;i<data.length;i++){
                                html += "<option value="+data[i]["id"]+">"+data[i]['profile']["name"]+"，"+data[i]['username']+"（"+data[i]['profile']['cityString']+"）"+"</option>";
                            }

                            $("#driver_id").html(html);

                            //重新渲染select
                            form.render('select');
                            $("#driver_id").next().addClass("layui-form-selected");
                            $("#driver_id").next().find("input").focus();
                            $("#driver_id").next().find("input").val(driver_name);
                            bindDriverFunc();
                        }
                    });
                }
                return false;
            }
            bindDriverFunc();

            $("#toSupplier").click(function(){
                var supplier_id = $("#supplier_id").val();
                if(supplier_id!=='999999' && supplier_id!=='1000000'){
                    var url = "{$kbx_url}"+"/admin/supplier/"+supplier_id;
                    window.open(url);
                }
                return false;
            });
        });
    });
</script>
</body>
</html>
